<template>
  <!-- el-icon组件，点击时触发toggleFullscreen方法，图标样式根据isFullscreen状态动态变化 -->
  <el-icon class="fullscreen-icon" @click="screenfull.toggle()">
    <i-OffScreen v-if="screenfull.isFullscreen" />
    <i-FullScreen v-else />
  </el-icon>
</template>
<script setup>
import screenfull from 'screenfull'
</script>
<style scoped>
/* 样式部分，将鼠标指针设置为手型，表示图标可以被点击 */
.fullscreen-icon {
  cursor: pointer;
}
</style>
